<script setup>
import { computed, ref } from 'vue'
const totalCount=ref(100)
// 计算属性，可以直接用箭头函数简写，省掉 {} 和 return
const disCount=computed(()=>totalCount.value*0.8)
const arr=ref([1,2,3,4,5])
const doubleArr=computed(()=>{
return arr.value.map(item=>item*2)
})
</script>
<template>
  <!-- 结构 template 中会自动解包，所以无需写 .value-->
<h1>原价:{{ totalCount }}</h1>
<h1>折扣价:{{ disCount }}</h1>
<button @click="totalCount+=100">修改原价</button>
<h2>{{ arr }}</h2>
<h2>{{ doubleArr }}</h2>
<button @click="arr.push(100)">修改数组</button>
</template>
<style></style>
